/**
 * Created by Administrator on 2017/10/11.
 */

import React from 'react';
import css from './index.less';
import { observer } from 'mobx-react';
import PropTypes from 'prop-types';
// import ContentEditable from 'react-contenteditable';
import { Icon } from 'antd';

@observer
export default class CircleRender extends React.Component {

  constructor(props) {
    super(props);
    this.state = {

    };
  }

  static propTypes = {
    mod: PropTypes.object,
  };


  isDelete() {
    const { delArea = () => {}, ind } = this.props;
    delArea(ind);
  }
  mouseDown() {
    const { mouseDown = () => {}, ind} = this.props;
    mouseDown(ind);
  }

  render() {
    const { mod, isActive } = this.props;

    const wrapperProps = {
      className: css.wrapper,
      style: mod.styleWrapper,
      onMouseDown: this.mouseDown.bind(this),
    };
    return (
      <div {...wrapperProps}>
        { isActive &&
        <Icon type="close-circle-o" className={css.delete} onClick={this.isDelete.bind(this)} />
        }
      </div>
    );
  }
}
